const IN_PRODUCTION = process.env.NODE_ENV === "production";

const purgecss = require("@fullhuman/postcss-purgecss")({
  content: ['./public/**/*.html', './src/**/*.html', './src/**/*.vue'],
  defaultExtractor(content) {
    const contentWithoutStyleBlocks = content.replace(
      /<style[^]+?<\/style>/gi,
      ""
    );
    return (
      contentWithoutStyleBlocks.match(
        /[A-Za-z0-9-_/:]*[A-Za-z0-9-_/]+/g
      ) || []
    );
  },
  safelist: [
    /-(leave|enter|appear)(|-(to|from|active))$/,
    /^(?!(|.*?:)cursor-move).+-move$/,
    /^router-link(|-exact)-active$/,
    /data-v-.*/,
  ],
});

module.exports = {
  publicPath: './',
  css: {
    loaderOptions: {
      postcss: {
        // 这里的选项会传递给 postcss-loader
        plugins: [
          require('tailwindcss'),
          require('autoprefixer'),
          ...IN_PRODUCTION
            ? [purgecss]
            : []
        ]
      }
    }
  }
}
